/**
 * 日期组件
 * Created by quxiangqian on 2018/7/10.
 */
export class Calendar extends React.Component {
    state={
        week:["日","一","二","三","四","五","六"],
        currDate:new Date(),
        spick:false
    }
    /**
     * 获取指定年月有多少天
     * @param year
     * @param month
     * @returns {number}
     */
    getCountDay=(year,month)=>{
       return new Date(year, month, 0).getDate();
    }

    /**
     * 获取这个月第一天是星期几
     * @param year
     * @param month
     * @returns {number}
     */
    getFirstDayOfWeek=(year,month)=>{
        return new Date(year, month, 1).getDay();
    }
    /**
     * 获取上一个月在这个日历显示的号数
     * @param year
     * @param month
     * @returns {Array}
     */
    getLastDays=(year,month)=>{
       let cuurweek= this.getFirstDayOfWeek(year,month);
       let maxday= this.getCountDay(year,month);
       let day=[];

       //day.push(30)
       for(let i=(maxday-cuurweek)+1;i<(maxday)+1;i++){
           day.push(i);
       }
       return day;
    }
    /**
     * 获取这个月最后的天
     * @param year
     * @param month
     * @returns {Array}
     */
    getNextDays=(year,month)=>{
        let nexdays= this.getCountDay(year,month);
        let cuurweek= this.getFirstDayOfWeek(year,month);
        let day=[];
        //day.push(30)
        console.log(year,month+1,"月",nexdays,cuurweek)

        for(let i=1;i<35-nexdays-cuurweek;i++){
            day.push(i);
        }
        return day;
    }
    /**
    *选择日期
    *@param v 日期值
    */
    select=(v)=>{
      this.props.comBoxVal(v,v);
      this.props.hide();
      let d=new Date(Date.parse(v));
      this.setState({currDate:d,spick:true});
    }

    lastMonth=()=>{

        let d=this.state.currDate;
        d.getMonth()
        d.setMonth(d.getMonth()-1);
        this.setState({currDate:d,spick:true});
    }
    nextMonth=()=>{
       this.props.defval=false;
       let d=this.state.currDate;
       d.getMonth()
       d.setMonth(d.getMonth()+1);
       this.setState({currDate:d,spick:true});
    }

    render(){
        let date=new Date();
         //this.props.comBoxVal(this.props.defval,this.props.defval);
        let cuurDate=this.state.currDate;
        if(this.props.defval&&!this.state.spick){
            cuurDate=new Date(Date.parse(this.props.defval));
            if(!this.state.spick){
              this.props.comBoxVal(this.props.defval,this.props.defval);
            }

        }

        let year=cuurDate.getFullYear(),month=cuurDate.getMonth();


        let lastmonth=month,currmonth=month+1,nextmonth=month+2;
        let lastyear=year,nextyear=year;
        if(month===0){
            lastyear--
            lastmonth=12
        }

        if(nextmonth>=13){
            nextyear++
            nextmonth=1
        }


        let daydata=[];
        let lastday=this.getLastDays(lastyear,lastmonth);
        let maxdays=this.getCountDay(year,currmonth);

        let lastkey=lastyear+"-"+((lastmonth<10)?("0"+lastmonth):lastmonth)+"-",currkey=year+"-"+((currmonth<10)?("0"+currmonth):(currmonth))+"-",nextkey=nextyear+"-"+((nextmonth<10)?("0"+(nextmonth)):(nextmonth))+"-"


        for(let a=0;a<lastday.length;a++){
            if(lastday[a]<10){
                lastday[a]="0"+lastday[a];
            }
            daydata.push({keys:lastkey+lastday[a],day:lastday[a]+"",stat:0});
        }
        for(let b=1;b<maxdays+1;b++){
            let c=b;
            if(b<10){
                c="0"+c;
            }
            daydata.push({keys:currkey+c,day:c+"",stat:1});
        }
        let grid=35;
        let rows=5;
        if((lastday.length+maxdays)>35){
            grid=42;
            rows=6;
        }
        for(let c=1;c<grid-maxdays-lastday.length+1;c++){
            let b=c;
            if(c<10){
                b="0"+c;
            }
            daydata.push({keys:nextkey+b,day:b+"",stat:2});
        }


        let days=[];
        for(let i=0;i<rows;i++){
            let row=[];
            for(let a=0;a<7;a++){
                let index=(i*7)+a;

                 let clo=daydata[index];
                 if(!clo){
                     break;
                 }
                 let classname="cell"
                 if(clo.stat!==1){
                     classname="disble"
                 }else{
                   if(parseInt(clo.day)===cuurDate.getDate()){
                      classname="cell active"
                   }
                 }

                 row.push(<td  className={classname}  onMouseDown={(e)=>this.select(clo.keys)}>{clo.day}</td>)
            }
            let rows=<tr>{row}</tr>
            days.push(rows);
        }

        return (
                <table className="caendar">
                    <tr>
                       <td  colspan="7">
                         <div className="menu">
                           <i className="fas fa-angle-left" onMouseDown={this.lastMonth}></i>
                           <span>{year}年-{month+1}月</span>
                           <i className="fas fa-angle-right" onMouseDown={this.nextMonth}></i>
                         </div>
                       </td>
                    </tr>
                    <tr>
                        {this.state.week.map((item)=><td>{item}</td>)}
                    </tr>
                    {days}
                </table>

        );
    }
}
